<template>
  <div class="global_bg">
    <van-nav-bar title="消息">
      <template #right>
        <van-icon name="delete-o" size="18" />
      </template>
    </van-nav-bar>
    <div class="msg_bg" @click="goChat">
      <div class="toux">
        <img src="@/assets/huanbei_logo.png" />
      </div>
      <div class="content">
        <p class="name">消息广场</p>
      </div>
    </div>
  </div>
</template>
<script>
import { NavBar } from 'vant'
import { useRouter } from 'vue-router'
import routerURL from '@/router/routerURL'
export default {
  components: {
    [NavBar.name]: NavBar,
  },
  setup() {
    const router = useRouter()
    const goChat = () => {
      router.push({ path: routerURL.CHATPAGE })
    }

    return {
      goChat,
    }
  },
}
</script>
<style scoped>
.msg_bg {
  height: 80px;
  display: flex;
  background-color: #fff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
.toux {
  flex: 2;
  border-radius: 50%;
  padding: 3px;
  overflow: hidden;
}
.toux img {
  width: 100%;
  height: 100%;
}
.content {
  flex: 8;

  flex-direction: column;
}
.name {
  font-size: 18px;
  font-weight: 700;
  line-height: 72px;
}
</style>
